<template>
    <van-pull-refresh v-model="isLoading" @refresh="onRefresh">
        <div class="my">
            <div class="my_information">
                <van-image round width="1.4rem" height="1.4rem" :src="logoUrl" />
                <div class="information">
                    <h5> {{ token.NickName || '--' }}     {{ token.Phone }}</h5>
                    <p> 
                        <span style="color:#ffa905;font-size:14px"> ID：{{ token.InviteCodeCode }} </span>
                    </p>
                </div>
                <div class="edit" @click="goMyinformation()"> <img src="../../src/assets/img/my/gengduo.png" alt=""> </div>
            </div>

            <div class="my_team">
                <div class="int" @click="goCapitalflow()">
                    <p> 消费积分 </p>
                    <h5> {{ MemberExt.Wallet1 || 0 }} </h5>
                </div>
                <div class="int" @click="goCapitalflow()">
                    <p> 冻结积分 </p>
                    <h5> {{ MemberExt.Wallet2 || 0 }} </h5>
                </div>
                <div class="int" @click="goCapitalflow()">
                    <p> 解冻积分 </p>
                    <h5> {{ MemberExt.Wallet3 || 0 }} </h5>
                </div>
                <!-- <div class="int" @click="goWithdrawal">
                    <span> 兑换 </span>
                </div> -->
            </div>
            <div class="my_gongneng">
                <div class="my_name">
                    <span> 我的订单 </span>
                    <a @click="gomyorder(1)"> 查看全部订单<van-icon name="arrow" /></a>
                </div>
                <div class="my_gongneng_list">
                    <!-- <div class="int">
                        <img src="../../src/assets/img/my/daifukuan.png" alt="">
                        <span> 待付款 </span>
                    </div> -->
                    <div class="int" @click="gomyorder(1)">
                        <img src="../../src/assets/img/my/daifahuo.png" alt="">
                        <span> 待发货 </span>
                    </div>
                    <div class="int" @click="gomyorder(2)">
                        <img src="../../src/assets/img/my/daishouhuo.png" alt="">
                        <span> 待收货 </span>
                    </div>
                    <div class="int" @click="gomyorder(3)">
                        <img src="../../src/assets/img/my/pingjia.png" alt="">
                        <span> 评价 </span>
                    </div>
                    <div class="int" @click="gomyorder(4)">
                        <img src="../../src/assets/img/my/tuikuanshouhou.png" alt="">
                        <span> 退款售后 </span>
                    </div>
                </div>
            </div>
            <div class="my_gongneng">
                <div class="my_name">
                    <span> 我的功能 </span>
                </div>
                <div class="my_gongneng_list">
                    <div class="int" @click="gopointscenter()">
                        <img src="../../src/assets/img/my/jifenzhongxin.png" alt="">
                        <span> 积分中心 </span>
                    </div>
                    <div class="int" @click="goMyteam()">
                        <img src="../../src/assets/img/my/fenxiaozhongxin.png" alt="">
                        <span> 分销中心 </span>
                    </div>
                    <div class="int" @click="goaddress()">
                        <img src="../../src/assets/img/my/shouhuodizhi.png" alt="">
                        <span> 收货地址 </span>
                    </div>
                    <div class="int" @click="gomerchantsettlement()">
                        <img src="../../src/assets/img/my/shangjiaruzhu.png" alt="">
                        <span> 商家入驻 </span>
                    </div>
                    <div class="int" @click="goShare()">
                        <img src="../../src/assets/img/my/pingjia.png" alt="">
                        <span> 我的分享 </span>
                    </div>
                    <!-- <div class="int" @click="gomerchantsettlement()">
                        <img src="../../src/assets/img/my/lianxikefu.png" alt="">
                        <span> 联系客服 </span>
                    </div> -->
                </div>
            </div>
        </div>
    </van-pull-refresh>
</template>

<script>
import { onMounted, reactive, ref, toRefs } from 'vue'
import { Toast, Notify } from 'vant';
import { useStore } from "vuex"; // ⚪️ 引入状态管理
import { useRoute, useRouter } from "vue-router";
import router from "@/router";
import { GetMemberExt } from "@/network/user";
import logoUrl from '@/assets/img/logo.png'
export default {
    setup() {
        const store = useStore(); // 获取对象
        const state = reactive({
            token: store.state.user.token,
            isLoading: false,
            logoUrl: logoUrl,
            MemberExt: {}
        });
        onMounted(() => {
            init();
        });
        // 初始化信息
        const init = () => {
            getUser();
            // 获取扩展信息
            GetMemberExt({
                Id: state.token.ID
            }).then((res) => {
                var data = res.Data;
                console.log(data)
                state.MemberExt = data
            });
        };
        const goWithdrawal = () => {
            router.push({
                path: "/withdrawal",
                query: {
                    date: new Date().getTime()
                }
            });
        };
        const goMyteam = () => {
            router.push({
                path: "/myteam",
                query: {
                    date: new Date().getTime()
                }
            });
        };
        const goCapitalflow = () => {
            router.push({
                path: "/Capital",
                query: {
                    date: new Date().getTime()
                }
            });
        };
        const goMyinvestment = () => {
            router.push({
                path: "/myinvestment",
                query: {
                    date: new Date().getTime()
                }
            });
        };
        const goMyinformation = () => {
            router.push({
                path: "/myinformation",
                query: {
                    date: new Date().getTime()
                }
            });
        };
        // 积分中心
        const gopointscenter = () => {
            router.push({
                path: "/pointscenter",
                query: {
                    date: new Date().getTime()
                }
            });
        };

        // 收货地址
        const goaddress = () => {
            router.push({
                path: "/address",
                query: {
                    date: new Date().getTime()
                }
            });
        };
        // 我的订单
        const gomyorder = (type) => {
            router.push({
                path: "/myorder",
                query: {
                    type: type,
                    date: new Date().getTime()
                }
            });
        };
        //我的分享
        const goShare = () => {
            router.push({
                path: "/share",
                query: {
                    date: new Date().getTime()
                }
            });
        };
        // 商家入驻  联系客服
        const gomerchantsettlement = () => {
            Toast('正在建设中...');
        };

        //获取用户信息 更新余额
        const getUser = () => {
            store.dispatch("GetMemberInfo", { Id: store.state.user.token.ID }).then((res) => {
                state.token = res.Data
            }).catch(() => { });
        }
        const onRefresh = () => {
            init()
            state.isLoading = false
        }
        return {
            ...toRefs(state),
            getUser,
            goShare,
            goWithdrawal,
            goMyteam,
            goCapitalflow,
            goMyinvestment,
            goMyinformation,
            onRefresh,
            gopointscenter,
            goaddress,
            gomerchantsettlement,
            gomyorder
        };
    },
};
</script>

<style scoped></style>